*{
    padding:0;
    margin:0;
}
header{
    width:100%;
    height:15vw;
    background:linear-gradient(to top, #ee5959,#e21424,#ee5959);
    line-height: 15vw;
    font-size: 5vw;
    text-align: center;
    color:white;
}
#choose{
    width:100%;
    height:15vw;
    position:fixed;
    bottom:0;
}
body{
    perspective: 500px;
    background:black;
}
#box{
    width:200px;
    height:200px;
    margin:200px auto;
    position:relative;

    animation: run 6s linear infinite;
    transform-style: preserve-3d;
    transform-origin: center center -100px;
}
@keyframes run{
    from{
        transform:rotate3d(0,1,0,0deg);
    }
    to{
        transform: rotate3d(0,1,0,360deg);
    }
}
#box div{
    width:200px;
    height:200px;
    position:absolute;
    transform-style: preserve-3d;
    text-align: center;
    line-height: 200px;
}
#box div:nth-child(1){
    background:rgba(255,0,0,0.5);
    transform: translateX(-200px) rotateY(-90deg);
    transform-origin: right;
}
#box div:nth-child(2){
    background:rgba(0,255,0,0.5);
    transform:translateX(200px) rotateY(90deg);
    transform-origin: left;
}
#box div:nth-child(3){
    background:rgba(0,0,255,0.5);
    transform: translateY(-200px) rotateX(90deg);
    transform-origin: bottom;
}
#box div:nth-child(4){
    background:rgba(255,255,0,0.5);
    transform: translateY(200px) rotateX(-90deg);
    transform-origin: top;
}
#box div:nth-child(5){
    background:rgba(0,255,255,0.5);
    transform: translateZ(-200px);
}
#box div:nth-child(6){
    background:rgba(255,0,255,0.5);
}